<template>
	<div class="bg-white">
		<div class="shadow rounded overflow-hidden mt-3">
			<div class="bg-main p-2 justify-content-between d-flex">
					<div class="text-xs">提款记录详细</div>
					<div class="text-xs">{{dztq.tqjlid}}</div>
			</div>
			<div>
				<Row>
					<Col class="p-1" :xs="24" :sm="24" :md="12" :lg="8" :xl="6" :xxl="6">
						<div class="shadow rounded p-2 ">
							<div class="d-flex justify-content-between ">
								<span class="text-xss">店长id</span>
								<span class="text-xss">{{dztq.dzid}}</span>
							</div>

							<div class="d-flex justify-content-between">
								<span class="text-xss">店长OPENID</span><br>
								<span class="text-xss">{{dztq.openid}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span>店长名称</span>
								<span>{{dztq.dname}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span>提取金额</span>
								<span>¥{{dztq.amount}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span>抽成比例</span>
								<span>{{dztq.ccbl}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span >实际金额</span>
								<span class="text-danhong">¥{{dztq.sjje}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span>余额</span>
								<span>¥{{dztq.yeamount}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span>提取时间</span>
								<span>{{dztq.ct}}</span>
							</div>
							<div class="d-flex justify-content-between">
								<span>提取状态</span>
								<span class="text-danhong" v-if="dztq.zt == 'R'">已提取</span>
								<span class="text-danhong" v-if="dztq.zt == 'F'">已到账</span>
							</div>
						</div>
					</Col>
				</Row>
			</div>
			
<!-- 			<div class="shadow rounded overflow-hidden mt-3">
				<div class="bg-main p-2">
					<span>场地预约记录详细</span>
				</div>
				<div>
					<Row class="">
						<Col v-for="(yyjl,index) in roomyyjls" :key="index"
						class="p-1" :xs="24" :sm="24" :md="12" :lg="8" :xl="6" :xxl="6">
							<div class="shadow rounded p-2">
								<div class="p-2">
									<div>场地预约记录{{yyjl.rmorderid}}</div>
								</div>
								<div class="p-2 d-flex justify-content-between">
									<div>教练名称</div>
									<span>{{yyjl.jlname}}</span>
								</div>
								<div class="p-2 d-flex justify-content-between">
									<div>场地费用</div>
									<span>{{yyjl.amont}}</span>
								</div>
								<div class="p-2 d-flex justify-content-between">
									<div>实付金额</div>
									<span>{{yyjl.sfje}}</span>
								</div>
								<div class="p-2 d-flex justify-content-between">
									<div>余额支付金额</div>
									<span>{{yyjl.yezfje}}</span>
								</div>
								<div class="p-2 d-flex justify-content-between">
									<div>房间名称</div>
									<span>{{yyjl.rname}}</span>
								</div>
								<div class="p-2 d-flex justify-content-between">
									<div>场地预约日期</div>
									<span>{{yyjl.ct}}</span>
								</div>
							</div>
						</Col>
					</Row>
				</div>
			</div> -->
			
			
		</div>
		<div>
			<Page class="text-right mt-3" :page-size="tableInfo.size" @on-change="pageSearch"
				:total="tableInfo.total" />
		</div>

	</div>
</template>

<script>
	export default {
		data() {
			return {
				tableInfo: {
					current: 1,
					size: 6,
					total: 0
				},
				dztq: {},
				roomyyjls: []
			}
		},
		created: function() {
			this.dztq.tqjlid = this.$route.query.tqjlid;
			this.loadData();
			this.tableInfo.current = 0;
		},
		methods: {
			loadData: function() {
				 this.http.get({
					url: "/dz/dztkjl/info",
					param: {
						tqjlid: this.dztq.tqjlid,
						current: this.tableInfo.current,
						size: this.tableInfo.size
					}
				}).then(res => {
					console.log("detail:");
					console.log(res);
					this.tableInfo.current = res.aroomyyjls.current;
					this.tableInfo.size = res.aroomyyjls.size;
					this.tableInfo.total = res.aroomyyjls.total;
					this.dztq = res.dztq;
					this.roomyyjls = res.aroomyyjls.records;
					
				});
			},	
			pageSearch: function(changedPage) {
				this.tableInfo.current = changedPage;
				this.loadData();
			}
		}
	}
</script>

<style>
</style>